@import "../../total.less";

.category_page {
    padding: 50px;
    background: #fff;

    .top {
        display: flex;
        justify-content: space-between;

        section {
            width: 496px;
            height: 120px;
            color: #fff;
            text-align: center;
            line-height: 120px;

            &:nth-child(1) {
                background: @blue;
            }

            &:nth-child(2) {
                background: #FFC837;
            }
        }
    }

    .title {
        font-size: 38px;
        height: 180px;
        line-height: 180px;
        color: #666666;
    }

    .list {
        overflow: hidden;
        li {
            float: left;
            width: 320px;
            height: 80px;
            background: #F0F0F0;
            font-size: 42px;
            color: #333333;
            line-height: 80px;
            text-align: center;
            margin-right: 32px;
            margin-bottom: 33px;

            &:nth-of-type(3n){
                margin-right: 0;
            }

            &.active{
                background: @blue;
                color: #fff;
            }
        }
    }
}